Util.barChart=function(container,data,cfg,callback){
    this.container=container;
    this.data=data;
    this.config={
    	width:257,
    	height:76,
        leftOffset:40
    };
    this.callback=callback;
    $.extend(true, this.config, cfg);
    this.minRate=0;
    this.maxRate=0;
    this.unit=0;
    this.init();
};
Util.barChart.prototype={
	init:function(){        		
		if(this.data.length>0){
			this.HTML = '<div class="qs-bar-chart" style="width:'+this.config.width+'px;height:'+this.config.height+'px;margin-left:'+(this.config.leftOffset-10)+'px;"></div>';
			this.firstItemMarginLeft = 7;//first item left margin
			this.itemBorder = 1;//item border width
			this.el = $(this.HTML).appendTo(this.container);			
			this._bindData(this.data);
		}        		
	},
    _isIE:function(){
        return navigator.userAgent.indexOf('MSIE')>=0;
    },
	_rounding:function(data,how){
		return Math.round(data*Math.pow(10,how||0))/Math.pow(10,how||0);
	},
	_dataFormat:function(data,how){
		var tData = Math.round(data*Math.pow(10,how||1))+'';		
		if(tData.indexOf('.')<0){
			var l = tData.length;
			tData = (tData.substr(0,l-how)==''?'0':tData.substr(0,l-how))+'.'+tData.substr(l-how,how);
		}
		return tData;
	},
	_createBar:function(data){
        this._emptyChart();
        var barHeight = 0;
        var barHTML = '';
        var barData = data;
        var barMark = '';
        var k = barData.length;                         
        for(var i=0;i<k;i++){
            barHeight = this._rounding(data[i]['Yield']/this.maxRate,2)*100;
            if(this._isIE()==true){
                barMark = '<img src="//rtqimg.morningstar.com/theme/lloyds/'+(i+1)+'M.png" />';
            }else{
                barMark = (i+1)+'M';
            } 
            barHTML = barHTML+'<span class="qs-bar-chart-item" style="width:'+this._rounding((this.config.width-this.firstItemMarginLeft)/k-this.itemBorder)+'px" title="'+data[i]['Yield']+'"><em class="qs-bar-mark rotate">'+barMark+'</em><strong class="qs-bar" style="height:'+barHeight+'%;width:22%;margin-left:-11%;"></strong></span>'
        }		
		this.el.append(barHTML);
	},
	_emptyChart:function(){
		this.el.empty();
	},
	_creatAxis:function(n){                
        var axisHTML = '';
        for(var i=0;i<n;i++){         
            axisHTML = axisHTML+'<div class="point" style="height:'+this.unit*100/this.maxRate+'%">'+this._dataFormat(this._rounding(this.maxRate-this.unit*i,1),2)+'</div>';
        }
        axisHTML = '<div class="axis-y">'+axisHTML+'</div>';
        this.el.append(axisHTML);
	},
	_bindData:function(data){
        var b = data.length-1;        
        this.maxRate = this._rounding(this._rounding(data[b]['Yield'],2),1);
        if(this.maxRate<data[b]['Yield']){//don't make column overflow the frame
            this.maxRate = (this.maxRate*10+1)/10;
        }
        this.minRate = this._rounding(this._rounding(data[0]['Yield'],2),1);
        this.unit = this._rounding((this.maxRate-this.minRate)/2,1);
        var n = this._rounding((this.maxRate-this.minRate)/this.unit);        
		this._createBar(data);
		this._creatAxis(n);
	},
	reBindData:function(data){
        if((typeof data)!='undefined'&&data.length>0){this.data=data;}
		this._bindData(data);
	},
    resize:function(w,h){
        if((typeof w)=='undefined'||(typeof h)=='undefined'){
            return false;
        }
        this.config.width=w;
        this.config.height=h;
        this.el.width(w).height(h);
        this._bindData(this.data);
    },
	clear:function(){
        for(var p in this){
            if(!p || p == 'clear'){continue;}
            this[p] = null;
            delete this[p];
        }
    }
};